import { computed } from 'vue'
import { useUserStore } from '../stores/user'

/**
 * 权限管理工具
 */
export function usePermission() {
  const userStore = useUserStore()
  
  // 当前用户角色
  const userRole = computed(() => userStore.currentUser?.userRole || '')
  
  // 检查是否有权限
  const hasPermission = (requiredRoles?: string | string[]): boolean => {
    // 如果没有指定角色要求，默认允许访问
    if (!requiredRoles || (Array.isArray(requiredRoles) && requiredRoles.length === 0)) {
      return true
    }
    
    // 如果用户未登录，没有权限
    if (!userRole.value) {
      return false
    }
    
    // 转换为数组进行检查
    const roles = Array.isArray(requiredRoles) ? requiredRoles : [requiredRoles]
    
    // 检查用户角色是否在允许的角色列表中
    return roles.includes(userRole.value)
  }
  
  // 检查是否是管理员
  const isAdmin = computed(() => userRole.value === 'admin')
  
  // 检查是否是普通用户
  const isUser = computed(() => userRole.value === 'user')
  
  // 检查是否有指定角色
  const hasRole = (role: string): boolean => {
    return userRole.value === role
  }
  
  // 检查是否有任意一个角色
  const hasAnyRole = (roles: string[]): boolean => {
    return roles.includes(userRole.value)
  }
  
  // 检查是否有所有角色（用于复合权限）
  const hasAllRoles = (roles: string[]): boolean => {
    // 这里简化处理，用户通常只有一个角色
    // 如果需要支持多角色，需要修改用户模型
    return roles.includes(userRole.value)
  }
  
  return {
    userRole,
    hasPermission,
    isAdmin,
    isUser,
    hasRole,
    hasAnyRole,
    hasAllRoles
  }
}

/**
 * 路由权限检查
 */
export function checkRoutePermission(to: any): boolean {
  const { hasPermission } = usePermission()
  
  // 检查路由元信息中的角色要求
  const requiredRoles = to.meta?.roles
  
  return hasPermission(requiredRoles)
}

/**
 * 权限指令配置（可选）
 */
export const permissionDirective = {
  mounted(el: HTMLElement, binding: any) {
    const { hasPermission } = usePermission()
    const { value } = binding
    
    if (!hasPermission(value)) {
      // 移除元素或隐藏
      el.style.display = 'none'
      // 或者完全移除：el.parentNode?.removeChild(el)
    }
  },
  
  updated(el: HTMLElement, binding: any) {
    const { hasPermission } = usePermission()
    const { value } = binding
    
    if (!hasPermission(value)) {
      el.style.display = 'none'
    } else {
      el.style.display = ''
    }
  }
}

/**
 * 角色常量
 */
export const ROLES = {
  ADMIN: 'admin',
  USER: 'user'
} as const

export type Role = typeof ROLES[keyof typeof ROLES]
